<template>
    <div class="radionewlist">
        <Header v-bind:isBack="isBack" v-bind:title="title"></Header>
        <div class="list">
            <div class="list-item space-between padding-24 bg-f" v-for="(item,index) in newranklist" :key="index">
                <div class="left" :class="{red:index<=2}">{{index+1}}</div>
                <div class="right space-between">
                    <div class="lefts center-col">
                        <img :src="item.user_avator" alt="" class="yuan">
                        <p class="fs-32 color-0 overFlow">{{item.nickname}}</p>
                    </div>
                    <div class="rights center-col">
                        <img :src="fire" alt="">
                        <p class="fs-24 color-9 ">{{item.view_number}}</p>
                    </div>
                </div>
            </div>
            <div class="center" v-if="newranklist[0]">-- END --</div>
        </div>
    </div>
</template>
<script>
export default {
    data(){
        return{
            isBack:true,
            title:'新人榜',
            fire:require('../../assets/mine/fire.png'),
            newranklist:[
                // {
                //     img:require('../../assets/image/cove.png'),
                //     name:'胆小鬼胆哈哈哈哈哈哈哈哈哈哈哈',
                //     num:599,
                //     title:'呵呵',
                //     isplay:1,
                // },
                // {
                //     img:require('../../assets/image/cove.png'),
                //     name:'胆小鬼胆哈哈哈',
                //     num:599,
                //     title:'呵呵',
                //     isplay:0,
                // },
                // {
                //     img:require('../../assets/image/cove.png'),
                //     name:'胆小鬼胆哈哈哈',
                //     num:599,
                //     title:'呵呵',
                //     isplay:0,
                // },
                // {
                //     img:require('../../assets/image/cove.png'),
                //     name:'胆小鬼胆哈哈哈',
                //     num:599,
                //     title:'呵呵',
                //     isplay:0,
                // }
            ]
        }
    },
    created(){
        this.getnewRadioAnchor()
    },
    methods:{
        getnewRadioAnchor(){
            var url = this.$host1 + `home/radio/newRadioAnchor`;
            this.$axios.get(url,{
                params:{
                    type:2
                }
            }).then(res => {
                console.log(res)
                //return
                if (res.status == 200) {
                    let resData = res.data;
                    if(resData.code==200){
                        this.newranklist=resData.data
                    }else{
                        this.newranklist=[]
                    }
                    
                    
                    // if (resData.code == 200) {
                    //     //this.imgshow=resData.data
                    // }else{
                    //     this.AlertWin(resData.message);
                    // }
                }
            }).catch(() => {
                this.newranklist=[]
                this.AlertWin("网络错误！请稍后重试！");
            });
        },
    }
}
</script>
<style lang="scss">
.radionewlist{
    .list{
        margin-top: 1rem;
        height: auto;
        .list-item{
            height: 1.2rem;
            border-bottom: 0.01rem solid #e9e9e9;
            .left{
                text-align: center;
                //background-color: greenyellow;
                font-weight: bold;
                width: 0.8rem;
                font-size: 0.55rem;
            }
            .red{
                color: #F44349;
            }
            .right{
                width: calc(100% - 1rem);
                height: 100%;
                .lefts{
                    img{
                        width: 0.9rem;
                        height: 0.9rem;
                        margin-right: 0.2rem;
                    }
                    p{
                        width: 3rem;
                        //background-color: blue;
                    }
                }
                .rights{
                    img{
                        width: 0.26rem;
                        height: 0.29rem;
                        margin-right: 0.1rem;
                    }
                }
            }
        }
        .list-item:last-child{
            border-bottom: none;
        }
        .center{
            height: 1rem;
        }
    }
}
</style>